<template>
  <div class="compatible-wrap">
    <div class="form-box table-box form-wrap">
      <el-form
          ref="formDataRef"
          :model="formData"
          label-width="110px"
          class="form"
          id="form_table"
      >
        <el-row type="flex" class="row-bg edit_form">
          <el-col :span="12">
            <el-form-item label="上级机构名称：" prop="trainPeriod">
              <el-input v-model="formData.trainPeriod"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="机构名称：" prop="institutionName">
              <el-input v-model="formData.institutionName"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" class="row-bg edit_form">
          <el-col :span="12">
            <el-form-item label="机构简称：" prop="institutionBrif">
              <el-input v-model="formData.institutionBrif"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="英文名称：" prop="institutionEnName">
              <el-input v-model="formData.institutionEnName"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" class="row-bg edit_form">
          <el-col :span="12">
            <el-form-item label="机构状态：" prop="institutionStatus">
              <el-input v-model="formData.institutionStatus"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="排序：" prop="sort">
              <el-input-number v-model="formData.sort" min="1" step="1"></el-input-number>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" class="row-bg edit_form">
          <el-col :span="12">
            <el-form-item label="社会信用代码：" prop="socialCreditCode">
              <el-input v-model="formData.socialCreditCode"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="单位性质：" prop="institutionType">
              <el-input v-model="formData.institutionType"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" class="row-bg edit_form">
          <el-col :span="12">
            <el-form-item label="国家：" prop="country">
              <el-input maxlength="64" v-model="formData.country"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="省份/直辖市：" prop="province">
              <el-input maxlength="64" v-model="formData.province"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" class="row-bg edit_form">
          <el-col :span="12">
            <el-form-item label="城市：" prop="city">
              <el-input v-model="formData.city"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="办公地址：" prop="workAddr">
              <el-input v-model="formData.workAddr"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" class="row-bg edit_form">
          <el-col :span="12">
            <el-form-item label="邮政编码：" prop="postalCode">
              <el-input v-model="formData.postalCode"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系电话：" prop="trainPeriod">
              <el-input v-model="formData.telephone"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <div class="form-btn">
      <el-button @click="onClose">取消</el-button>
      <el-button type="primary" @click="onSubmit">确定</el-button>
    </div>
  </div>
</template>

<script setup>
import { useRoute } from "vue-router";
const route = useRoute();
const disabled = ref(false);
const formData = ref({
  trainPeriod: "",
  institutionCode: "",
  institutionName: "",
  institutionBrif: "",
  institutionEnName: "",
  parentId: "",
  parentName: "",
  institutionStatus: "",
  sort: "",
  socialCreditCode: "",
  institutionType: "",
  country: "",
  province: "",
  city: "",
  workAddr: "",
  postalCode: "",
  telephone: "",
});
onMounted(async () => {
  let { id } = route.query;
  if (id) {
  }
});


const formDataRef = ref();
const onSubmit = () => {
  formDataRef.value.validate((valid) => {
    if (valid) {
      const params = {
        ...formData.value,
        startTime: formData.value.startTimeEnd[0],
        endTime: formData.value.startTimeEnd[1],
      };

    }
  });
};

const onClose = () => {
  closeDialog(true);
};
</script>

<style scoped lang="scss">

</style>
